<template>
  <div class="data-wrapper">
    <div class="top-data">
      <el-button type="warning" plain><span><slot name="topName">上层溶解氧</slot></span></el-button>
      <el-button type="warning" circle><span><slot name="topData">20%</slot></span></el-button>
      <div>
        <!--        上下层分界线-->
      </div>
    </div>
    <div>
      <el-button type="warning"><span><slot name="bottomName">下层溶解氧</slot></span></el-button>
      <el-button type="warning" circle><span><slot name="bottomData">10%</slot></span></el-button>
    </div>
  </div>
</template>

<script>
export default {
  name: "modlue-data-yellow"
}
</script>

<style scoped lang="less">
.top-data{
  margin-bottom: 3vh;
}
</style>